<template>
  <y-dialog @close="emit('close')" width="1000px" append-to-body>
    <el-form
      ref="verifyBugRef"
      :model="form"
      :rules="rules"
      size="default"
      label-width="120px"
    >
      <!-- 验证结论 -->
      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="验证结论" prop="extras.result">
            <el-select
              v-model="form.extras.result"
              placeholder="请选择验证结论"
              style="width: 240px"
              clearable
            >
              <el-option
                v-for="item in verificationOptions"
                :key="item.value"
                v-bind="item"
              />
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>

      <!-- 验证描述 -->
      <el-row>
        <el-col :span="24">
          <el-form-item label="验证描述" prop="description">
            <y-editor
              editor-id="editorBugClose"
              v-model="form.description"
              placeholder="请输入验证描述"
            />
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>

    <template #footer>
      <div class="dialog-footer">
        <el-button type="primary" @click="submit">确定</el-button>
        <el-button type="warning" @click="reset">重置</el-button>
        <el-button @click="emit('close')">取消</el-button>
      </div>
    </template>
  </y-dialog>
</template>

<script setup>
import { addBugOperate } from "@/api/tms/bug/operate";

const { proxy } = getCurrentInstance();
const emit = defineEmits(["submited", "close"]);

// 静态选项数据
const verificationOptions = [
  { value: "PASSED", label: "回归通过" },
  { value: "FAILED", label: "回归不通过" },
];

const data = reactive({
  form: {
    description: "",
    extras: {
      result: "",
    },
  },
  rules: {
    "extras.result": [
      { required: true, message: "验证结论不能为空", trigger: "blur" },
    ],
    description: [
      { required: true, message: "验证描述不能为空", trigger: "blur" },
    ],
  },
});

const { form, rules } = toRefs(data);

const props = defineProps({
  id: {
    type: String,
    default: "",
  },
  getMethod: {
    type: Function,
    required: true,
  },
  updateMethod: {
    type: Function,
    required: true,
  },
});

/** 重置Form方法 */
function reset() {
  form.value = {
    description: "",
    extras: {
      result: "",
    },
  };
}

/** 提交按钮事件 */
const submit = async () => {
  try {
    await proxy.$refs["verifyBugRef"].validate();
    const bug = await props.getMethod(props.id);
    await props.updateMethod({
      ...bug.data,
      status: form.value.extras.result === "PASSED" ? "closed" : "reactivated",
    });
    await addBugOperate({
      bug: props.id,
      operation: "VERIFY",
      description: form.value.description,
      extras: {
        result: form.value.extras.result,
      },
    });
    proxy.$modal.msgSuccess("操作成功");
    submited();
  } catch (error) {
    console.error("操作失败:", error);
  }
};

/** submited事件 */
function submited() {
  emit("submited");
  emit("close");
}
</script>
